import { Button, Form } from "antd";
import styles from './index.less';
import InputType from "../InputType";
import { formLayout } from '@/utils/util'
import { useEffect } from "react";
interface SearchFormProps {
    onFinish: (values: any) => void;
    list: (listItem | undefined)[],
    values?: any
}
//用于table搜索的区域
const SearchForm = (props: SearchFormProps) => {
    const [form] = Form.useForm();
    //重置
    function onResetBtn() {
        history.back()
    }
    useEffect(() => {
        if (props.values) {
            form.setFieldsValue(props.values)
        }
    }, [props.values])
    return (
        <Form form={form} className={styles.FormWrap} onFinish={props.onFinish} {...formLayout}>
            {
                props.list.map((jtem, jndex) => {
                    if (jtem) {
                        return (
                            <Form.Item
                                name={jtem.name}
                                label={jtem.label}
                                rules={jtem.rules}
                                initialValue={jtem.initialValue}
                                extra={jtem.extra}
                                hidden={jtem.hidden}
                                htmlFor={jtem.htmlFor}
                                wrapperCol={jtem.wrapperCol}
                                colon={jtem.colon}
                                dependencies={jtem.dependencies}
                                key={jndex}
                                getValueFromEvent={jtem.getValueFromEvent}
                                className={styles.FormItem}>
                                <InputType {...jtem} />
                            </Form.Item>
                        )
                    }
                })
            }
            <div style={{ display: "flex", justifyContent: "center" }}>
                <Button onClick={onResetBtn} style={{ marginRight: "8px" }}>取消</Button>
                <Button type="primary" htmlType="submit">确定</Button>
            </div>
        </Form>
    )
}


export default SearchForm;